const path = require('path');
const _ = require('lodash');
const { VueLoaderPlugin } = require('vue-loader');
const { merge } = require('webpack-merge');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');

function baseConfigure (mode) {
    return {
        mode,
        entry: './main.js',
        output: {
            path: path.resolve(__dirname, './dist'),
            filename: '[name].[hash].js'
        },
        module: {
            rules: [
                {
                    test: /\.vue$/,
                    use: [
                        'vue-loader'
                    ]
                },
                {
                    test: /\.css$/,
                    use: [
                        'style-loader',
                        'css-loader'
                    ]
                }
            ]
        },
        plugins: [
            new VueLoaderPlugin(),
            new webpack.optimize.SplitChunksPlugin({
                name: 'common-bundle'
            }),
            new HtmlWebpackPlugin({
                template: './index.html'
            })
        ]
    }
}

// CommonsChunkPlugin 插件可以将公共的依赖模块提取到已有的入口 chunk 中，或者提取到一个新生成的 chunk。

module.exports = env => {
    const configure = env === 'development' ? require('./webpack.development.config') : require('./webpack.product.config');
    let baseConfig = baseConfigure(env);
    return merge(baseConfig, configure);
}
